<template>
  <div class="LineChartGroup">

    <el-row :gutter="20" class="panel-group">
      <el-col :xs="24" :sm="24" :lg="12" :xl="12">
        <div class="chart-wrapper">
          <p class="box-between line-warp-title">
            <!-- <span>自助机平均每日使用情况时段图 </span> -->
          </p>
          <bar-chart :chart-data="barChartItem" />
        </div>
      </el-col>
      <el-col :xs="24" :sm="24" :lg="12" :xl="12">
        <div class="chart-wrapper">
          <p class="box-between line-warp-title">
            <!-- <span>自助机平均一周每日使用分布图 </span> -->
          </p>
          <line-chart :chart-data="lineChartItem" />
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import LineChart from './components-group/LineList'
import BarChart from './components-group/BarList'
// import {
//   departmentStatistics,
//   departmentFeeStatistics
// } from '@/api/dashboard/index'
export default {
  components: {
    LineChart,
    BarChart
  },
  props: {
    itemsInfo: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      timeTitle: '',
      lineChartItem: {
        // expectedData: [],
        // actualData: []
      },
      barChartItem: {
        bus_type_name: [],
        total_num: []
      }
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.initLineChart()
      this.initBarChart()
    })
  },
  methods: {
    initLineChart() {
      if (this.itemsInfo.item) {
        this.lineChartItem.bus_type_name = this.itemsInfo.item.bus_type_name
        this.lineChartItem.total_num = this.itemsInfo.item.total_num
      }
    //   this.itemsInfo.item.eight.forEach((res) => {
    //     this.lineChartItem.expectedData.push(res.num)
    //     const day = res.date.split('-')
    //     this.timeTitle = `（${day[0]}年)`
    //     this.lineChartItem.actualData.push(`${day[1]}-${day[2]}`)
    //   })
    },
    initBarChart() {
      if (this.itemsInfo.item) {
        this.barChartItem.bus_type_name = this.itemsInfo.item.bus_type_name
        this.barChartItem.total_num = this.itemsInfo.item.total_num
      }
      console.log(this.barChartItem, '99999')
    }
  }
}
</script>

<style lang="scss" scoped>
.LineChartGroup {
  margin-top: 30px;
  .chart-wrapper {
    padding:10px 20px;
    height: 400px;
    background: rgba(255, 255, 255, 1);
    border-radius: 5px;
    margin-bottom: 10px;
    .line-warp-title {
      line-height: 30px;
      margin: 10px 0;
      font-size: 16px;
      color: #333333;
    }
  }
}
</style>
